<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>Insert title here</title>
        <script src="../lib/jquery-1.11.1.min.js"></script>
        <style>
            body {
                text-align: center;
                background-color: rgba(1, 63, 75, 0.95);
                padding: 20px;
            }

            div {
                margin: 0 auto;
            }

            #content {
                margin: 100px auto;
            }
            ul li{
                color: crimson;
                list-style: none;
            }
        </style>
    </head>
    <body>
        <div>
            <select>
            	<option>zh</option>
            	<option>en</option>
            </select>
            <input type="button" id="sentiment" value="GET SENTIMENT"/>
        </div>
        <div>
            <textarea rows="10" cols="190" id="text"></textarea>
        </div>
        <div>
            <textarea rows="1" cols="19" id="content"></textarea>
        </div>
        <div>
            <ul>
            	<li>Negative+:[-100, -60)</li>
                <li>&nbspNegative:[-60, -20)</li>
                <li>&nbspNeutral:[-20,20]</li>
                <li>Positive:(20, 60]</li>
                <li>Positive+:(60, 100]</li>
            </ul>
        </div>
    </body>
    <script>
        $("#sentiment").on("click", function () {
            var language = $('select option:selected').text();
            var text = $("#text").val();
            var message = '';
            if(!text){
            	alert('Please enter content');
            	return;
            }
            
            $("#content").text("waiting....");

            $.ajax({
                type: "post",
                url: "/nlp/sentimentController/getSentiment",
                dataType: 'json',
                data:JSON.stringify({"language":language,"text":text}),
                contentType: 'application/json;charset=utf-8',
                async: true,
                cache: false,
                error: function () {
                    $("#content").text("");
                    alert("there was an error");
                },
                success: function (data) {
                    $("#content").text("");
                    message = data.message;
                    if('Success' == message){
                    	console.log(data.data.length);
                    	for (var i = 0; i < data.data.length; i++) {
                    		$("#content").text("score:"+data.data[i].score + "\r\n");
						}
                    }else{
                        $("#content").text('访问情感算法接口失败');
                    }
                }
            });
        });
    </script>
</html>